<!doctype html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <title>康威生命游戏</title>
    <link rel="stylesheet" href="../css/game.css" />
  </head>

  <body>
    <!--html-->

    <!--背景网格-->
    <div id="gameBoard" class="grid"></div>
    <!--控制-->
    <div id="control-block" class="flying-plat control-container">
      <div class="btn-container">
        <img id="control-close-btn" src="../static/images/right.png">
        <img id="control-open-btn" src="../static/images/left.png">
      </div>
      <div class="content">
        <button id="pause-btn" class="control-btn">开始</button>
        <button id="clear-btn" class="control-btn">清空</button>
        <button id="mode-btn" class="control-btn">单细胞</button>
        <div id="speed-div">速度：10帧/s</div>
        <input type="range" value="200" id="speed-range" min="1" max="1000" step="1" />
        <div id="gen-div">代数：0</div>
      </div>
    </div>
    <!--预设-->
    <div id="pre-block" class="flying-plat pre-container">
      <div class="btn-container">
        <img id="pre-close-btn" src="../static/images/bottom.png">
        <img id="pre-open-btn" src="../static/images/top.png">
      </div>
      <div id="pre-content" class="content">

      </div>
    </div>

    <!--js-->

    <!--全局变量-->
    <script src="../js/patterns.js"></script>
    <script src="../js/global.js"></script>
    <!--初始化网格方法（改变网格数/屏幕大小变化时调用）-->
    <script src="../js/initGrid.js"></script>
    <!--迭代方法-->
    <script src="../js/nextGeneration.js"></script>
    <script src="../js/gameController.js"></script>
    <!--卡片伸缩-->
    <script src="../js/gameCardControl.js"></script>
    <!--初始化预设-->
    <script src="../js/initPre.js"></script>

    <script>
      //初始化网格
      initGrid()

    </script>
  </body>
</html>
